<template>
  <div>
    <el-form ref="form" :model="role" label-width="80px">
      <el-form-item label="角色姓名">
        <el-input v-model="role.name"  style="width: 217px;"></el-input>
      </el-form-item>

      <el-form-item label="权限">
        <el-checkbox-group v-model="module" style="width: 110px;">
          <el-checkbox v-for="item in modules" :label="item.id">
            {{item.roleName}}
          </el-checkbox>
        </el-checkbox-group>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onAdd">添加</el-button>
        <el-button @click="cancel">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "roleAddView",
  data(){       //data:{}
    return {
      role:{
        name:"",
      },

      module:[],  //用户当前的角色
      modules:[
        // {
        //   id:1,
        //   roleName:"医生删除"
        // },
        // {
        //   id:2,
        //   roleName:"医生修改"
        // },
        // {
        //   id:3,
        //   roleName:"医生添加"
        // },
        // {
        //   id:4,
        //   roleName:"病人添加"
        // },

      ], //所有的角色
    }
  },

  created() {
    axios({
      //查询所有的权限
      url: '/api/module/queryModuleAll',
      method: 'post',
      headers:{"Authorization":"Bearer "+this.$store.state.user.token}
    }).then(res => {
      // console.log(res.data.data)
      this.modules=res.data.data
    })
  },

  methods:{
    onAdd(){
      //创建表格对象
      var formData = new FormData()
      for (const key in this.role){
        formData.append(key,this.role[key])
      }

      for (const key in this.module) {
        formData.append("ids",this.module[key])
      }

      //请给我写一个确定添加的前置条件
      if(confirm("确定要添加吗")) {
        axios({
          url: "/api/role/add",
          method: "post",
          data: formData,
          //添加请求头
          // headers: {"Content-Type": "multipart/form-data"}
          headers:{"Authorization":"Bearer "+this.$store.state.user.token}
        }).then(res => {
          this.$message({
            message: '添加成功',
            type:'success'
          });
          //返回医生信息表
          this.$router.push("/role")
        })
      }



        // axios.post("/api/user/add",formData)
        //     .then(res=>{
        //       this.$message({
        //         message: '添加成功',
        //         type:'success'
        //       });
        //       //返回医生信息表
        //       this.$router.push("/role")
        //     })


    },

    //删除文件
    removeImg(file){
      //根据uid删除对应的文件
      for (const key in this.fileList) {
        if (this.fileList[key].uid === file.uid) {
          this.fileList.splice(key, 1)
        }
      }
    },


    //添加图片
    changeImg(file){
      //直接将文件添加到数组中
      this.fileList.push(file)
      console.log("添加"+file.name)
    },
    cancel(){
      this.$router.push("/role/roleView")
    },
  }
}
</script>

<style scoped>

</style>
